(function ($) {
    $.fn.extend({
        login() {
            let userStr = JSON.parse(localStorage.getItem("user"))||"[]";
            if(userStr=="[]"){
                return;
            }else{
                $(".uname").html(userStr.u_name);
                $(".uname").attr("href","");
                $(".break").html("退出");
                if($(".break").html()=="退出"){
                    $(".break").attr("href","");
                    $(".break").on("click",function(){
                        localStorage.clear("user");
                    })
                }
                $(".hide").hide();
            }
        },
        addCart() {
            //将购物车内容添加到页面上
            let userStr = JSON.parse($.cookie("userData") || '[]');
            let strHtml = "";
            userStr.forEach((el, index) => {
                strHtml += `<tr data-info="${el.id}"" data-num="${el.num}" " data-price="${el.price}">`;
                strHtml += `<td><input type="checkbox" style="margin-left:20px;"></td>`
                strHtml += `<td><img src="${el.imgsrc}" class="cartImg" style="height:80px;width=80px;margin-left:20px"></td>`;
                strHtml += `<td><p>${el.goods}</p><p>规格:${el.type}</p></td>`;
                strHtml += `<td>${el.price}</td>`;
                strHtml += `<td><button id="sub">-</button><input type="text"value="${el.num}"class="num" ><button id="add">+</button></td>`;
                strHtml += `<td>${parseFloat(el.num * el.price)}</td>`;
                strHtml += `<td><a class="del"></a></td>`;
                strHtml += `</tr>`;
                return strHtml;
            })
            this.append(strHtml);
            //全选
            $(".checkAll>input").click(function () {
                $(".tabbody").find("input:checkbox").prop("checked", $(this).prop("checked"));
                $(".checkoutSubmit").find("input:checkbox").prop("checked", $(this).prop("checked"));

                $(".tabbody").total();

            })
            $(".checkoutSubmit").find("input:checkbox").click(function () {
                $(".tabbody").find("input:checkbox").prop("checked", $(this).prop("checked"));
                $(".checkAll>input").prop("checked", $(this).prop("checked"));

                $(".tabbody").total();

            })
            //添加减少数量
            $(".tabbody").find("tr").find("#sub").on("click", function () {
                let num = parseInt($(this).next().attr("value"));
                num--;
                if (num < 1) {
                    return;
                }
                $(this).next().attr("value", num);
                let price = parseInt($(this).parent().prev().html());
                $(this).parent().next().html(price * num);
                let id = $(this).parents("tr").data("info");
                userStr.forEach(el => {
                    if (el.id == id) {
                        el.num = num
                    }
                })
                //将最新数量塞入cookie
                $.cookie("userData", JSON.stringify(userStr), { expires: 10 });
                //点击时checkbox状态为选中
                $(this).parents("tr").children().eq(0).find("input:checkbox").prop("checked", true);
                $(this).parents("tr").data("num", num);
                //获取页面上所有选中的tr
                $(".tabbody").total();

            })

            //添加件数
            $(".tabbody").find("tr").find("#add").on("click", function () {
                let num = parseInt($(this).prev().attr("value"));
                num++;
                if (num > 5) {
                    return;
                }
                $(this).prev().attr("value", num);
                let price = parseInt($(this).parent().prev().html());
                $(this).parent().next().html(price * num);
                let id = $(this).parents("tr").data("info");
                userStr.forEach(el => {
                    if (el.id == id) {
                        el.num = num
                    }
                })
                $.cookie("userData", JSON.stringify(userStr), { expires: 10 });
                //点击时checkbox状态为选中
                $(this).parents("tr").children().eq(0).find("input:checkbox").prop("checked", true);
                $(this).parents("tr").data("num", num);
                //计算页面总件数
                $(".tabbody").total();
            })

            //点击删除
            $(".tabbody").on("click", ".del", function () {
                let self = this;
                layer.msg('确定删除该商品吗？', {
                    time: 3000 //自动关闭
                    , btn: ['确定', '取消']
                    , yes: function (index) {
                        //点击确定后关闭弹框,删除商品
                        layer.close(index);
                        let userStr2 = JSON.parse($.cookie("userData") || '[]');
                        let id = $(self).parents("tr").data("info");
                        let newuserStr2 = userStr2.filter(el => el.id != id);
                        $.cookie("userData", JSON.stringify(newuserStr2), { expires: 10 })
                        //删除视觉效果
                        $(self).parents("tr").remove();
                        $(".tabbody").total();
                    }
                });
            })

            //批量删除
            $(".checkoutSubmit").on("click", ".alldel", function () {
                if ($(":checked").length == 0) {
                    layer.msg('您还没有选择商品！');
                    return;
                }

                layer.msg('确定删除该商品吗？', {
                    time: 3000 //自动关闭
                    , btn: ['确定', '取消']
                    , yes: function (index) {
                        layer.close(index);

                        //1,读取本地cookie
                        let userStr2 = JSON.parse($.cookie("userData") || '[]');
                        let $notchecked = $(".tabbody").find("input:checkbox:not(:checked)").parents("tr");

                        //未被选中的tr的id值
                        let idArr = [];
                        $notchecked.each((index, el) => {
                            idArr.push($(el).data("info"));
                            return idArr;
                        })
                        //选出未被选中的商品的cookie值
                        let delArr = [];
                        idArr.forEach((el, index) => {
                            let temp = index;//id的下标
                            userStr2.forEach(el => {
                                if (el.id == idArr[temp]) {
                                    delArr.push(el);
                                }
                            });
                            return delArr;
                        })
                        //将未被删除的商品保留至cookie
                        $.cookie("userData", JSON.stringify(delArr), { expires: 10 })
                        //删除视觉效果
                        $(".tabbody").find("input:checkbox:checked").parents("tr").remove();
                        $(".tabbody").total();

                    }
                });
            })
            //计算选中的总量;
            //给每个选框添加事件
            $(".tabbody").find("input:checkbox").on("click", function () {
                if ($(this).prop("checked") == true) {
                    $(".tabbody").total();
                }
                else if ($(this).prop("checked") == false) {
                    let totalnum = $(".checknum").html();
                    let totalmoney = $(".totalmoney").html();
                    totalnum -= $(this).parents("tr").data("num");
                    totalmoney = totalnum * $(this).parents("tr").data("price");
                    $(".checknum").html(`${totalnum}`);
                    $(".totalmoney").html(`${totalmoney}`);//商品总额
                    $(".sum").html(`${totalmoney}`);//合计
                }
                //如果当前页面上的勾小于商品行数,就取消全选的勾;
                if ($(".tabbody").find(":checked").length < $(".tabbody").find("input:checkbox").length) {
                    $(".checkAll>input").prop("checked", false);
                    $(".checkoutSubmit").find("input:checkbox").prop("checked", false);
                }
                //如果当前页面上的勾等于商品行数,就为全选打勾;
                if ($(".tabbody").find(":checked").length == $(".tabbody").find("input:checkbox").length) {
                    $(".checkAll>input").prop("checked", true);
                    $(".checkoutSubmit").find("input:checkbox").prop("checked", true);
                }

            })
        },
        //计算总额
        total() {
            let totalnum = 0;
            let totalmoney = 0;
            $(".tabbody").find("input:checked").parents("tr").each((index, el) => {
                totalnum += $(el).data("num");
                totalmoney += $(el).data("num") * $(el).data("price");
            })
            $(".checknum").html(`${totalnum}`);
            $(".totalmoney").html(`${totalmoney}`);//商品总额
            $(".sum").html(`${totalmoney}`);//合计
        }
    })

})(jQuery)
$(function () {
    $(".tabbody").addCart();
    $(".h-content").login()
})


